@page "/docio/sales-invoice"
@inject Microsoft.JSInterop.IJSRuntime JS
@using System.IO
@using Syncfusion.Blazor.Buttons
@using Syncfusion.Blazor.DropDowns
@using BlazorDemos.Data.FileFormats.DocIO
@inherits SampleBaseComponent;

<SampleDescription>
 <p style="font-size:16px">This sample demonstrates the generation of sales invoice from an input Word template using Mail Merge functionality of Essential DocIO.</p>   
</SampleDescription>
<ActionDescription>
  <p style="font-size:16px">DocIO allows you to create, read, manipulate, and render Word documents. With the mail merge support, you can create a batch of personalized document or report very easily and fast.</p>
        <ul style="font-size:16px">
            <li>
                You can design reports in Microsoft Word and allow DocIO to populate documents with data from various data sources such as business objects, ADO.NET objects, arrays, XML, dynamic objects, and relational objects.
            </li>
            <li>
                You can create advanced reports by dynamically repeating a region of the document and by nesting mail merge region inside each other to populate hierarchical data.
            </li>
        </ul>
    <p style="font-size:16px">More information about the Mail Merge functionality can be found in this <a href="https://help.syncfusion.com/file-formats/docio/working-with-mailmerge">documentation</a> section.</p> 
</ActionDescription>

    <div class="control-section">
        <p style="font-size:16px">Click the button to view the generated Word document. Please note that Microsoft Word Viewer or Microsoft Word is required to view the resultant Word document.</p>

        <div class="dropdown-control">
            <table>
                <tr>
                    <td>
                        <h5 class="row" style="font-size:16px">Select the Order ID : </h5>
                    </td>
                    <td>
                        <div class="drop-control" style="margin-left:4px; width:230px">
                            <SfDropDownList TItem="string" TValue="string" PopupHeight="230px" Placeholder="10248" @bind-Value="@DropVal" DataSource="@OrderID">
                            </SfDropDownList>
                        </div>
                    </td>
                </tr>
            </table>
        </div>
        <table>
            <tr>
                <td>
                    <h5 class="row" style="font-size:16px">Save As:</h5>
                </td>
                <td>
                    <div class="col-xs-12 col-sm-12 col-lg-1 col-md-6">
                        <SfRadioButton Label="DOC" Name="DOC" Value=@("DOC") @bind-Checked="@documentType"></SfRadioButton>
                    </div>
                </td>
                <td>
                    <div class="col-xs-12 col-sm-12 col-lg-1 col-md-6">
                        <SfRadioButton Label="DOCX" Name="DOCX" Value=@("DOCX") @bind-Checked="@documentType"></SfRadioButton>
                    </div>
                </td>
                <td>
                    <div class="col-xs-12 col-sm-12 col-lg-1 col-md-6">
                        <SfRadioButton Label="WordML" Name="WordML" Value=@("WordML") @bind-Checked="@documentType"></SfRadioButton>
                    </div>
                </td>
            </tr>
            <tr>
                <td colspan="4">
                    <div class="button-section">
                        <div id="button-control">
                            <div class="row">
                                <div>
                                    <SfButton @onclick="ViewTemplate">View Template</SfButton>&nbsp;
                                    <SfButton @onclick="GenerateDocument">Generate Document</SfButton>
                                </div>
                            </div>
                        </div>
                    </div>
                </td>
            </tr>
        </table>
    </div>

<style>

    .control-section .row {
        margin: 10px 0;
    }
</style>

@code {

    public string DropVal { get; set; }

    private List<string> OrderID = new List<string>() { "10248", "10249", "10250", "10251", "10252", "10253", "10254", "10255", "10256", "10257"};

    MemoryStream documentStream;
    string documentType = "DOCX";

    /// <summary>
    /// Create and download the simple Word document
    /// </summary>
    public async Task GenerateDocument(MouseEventArgs args)
    {
        int id = 0;
        int.TryParse(DropVal, out id);
        SalesInvoiceService service = new SalesInvoiceService();
        documentStream = service.CreateWordDocument(id, documentType, "Generate Document");
        if (documentType == "DOC")
            await JS.SaveAs("Sample.doc", documentStream.ToArray());
        else if (documentType == "WordML")
            await JS.SaveAs("Sample.xml", documentStream.ToArray());
        else
            await JS.SaveAs("Sample.docx", documentStream.ToArray());
    }
    /// <summary>
    /// Create and download the template Word document
    /// </summary>
    public async Task ViewTemplate(MouseEventArgs args)
    {
        SalesInvoiceService service = new SalesInvoiceService();
        documentStream = service.CreateWordDocument(0, documentType, "View Template");
        await JS.SaveAs("SalesInvoiceDemo.doc", documentStream.ToArray());
    }
}